<template>
  <el-dialog
    class="modify-class"
    width="80%"
    visible
    :title="title"
    :close-on-click-modal="true"
    :before-close="beforeClose"
  >
    <c-table
      style="margin:20px 0;"
      :loading="loading"
      :height="height"
      :table-data="tableData"
      :table-column="tableColumn"
      :operation="false"
      @pendingModel="pendingModelHandle"
    ></c-table>
    <to-do-detail-dialog v-if="detailData" :detail-data="detailData" @refresh-sub="refreshSubHandle" @close="detailData = null"></to-do-detail-dialog>
  </el-dialog>
</template>

<script>
import { overviewApis } from '@/apis'
import ToDoDetailDialog from './ToDoDetailDialog'

export default {
  components:{ToDoDetailDialog},
  props: {
    model: {
      type: Object,
      default() {
        return {}
      }
    },
    typeData: {
      type: Object,
      default() {
        return {
          type: 'PRO',
          label: '进度管理'
        }
      }
    },
    isFocus: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      height: '500px',
      tableColumn: {
        pendingModel: {
          type: 'link',
          label: '待办模块',
          columnProp: {
            showOverflowTooltip: true
          }
        },
        problemDesc: {
          label: '问题描述',
          columnProp: {
            showOverflowTooltip: true,
          }
        },
        focus: {
          label: '是否关注',
          width: '100px',
          columnProp: {
            align: 'center',
            formatter: this.focusFormatter
          }
        }
      },
      loading: false,
      tableData: [],
      detailData: null,
      enableRefresh: false
    }
  },
  computed: {
    title() {
      return `【${this.model.modelName}】【${this.typeData.label}】${this.isFocus ? '重点问题' : '待办问题'}列表`
    }
  },
  methods: {
    focusFormatter(row) {
      return row.focus == 0 ? '否' : '是'
    },
    pendingModelHandle(row) {
      this.detailData = row
    },
    close(refresh) {
      this.$emit('close', refresh)
    },
    beforeClose() {
      this.close(this.enableRefresh)
    },
    refreshSubHandle() {
      this.enableRefresh = true
    },
    requestListData() {
      const params = {
        modelId: this.model.modelId,
        type: this.typeData.type
      }
      if (this.isFocus) {
        params.focus = 1
      }
      this.loading = true
      overviewApis.pendingList(params).then(res => {
        this.tableData = res.data || []
        this.loading = false
      }).catch(() => {
        this.loading = false
      })
    }
  },
  mounted() {
    this.requestListData()
  }
}
</script>

<style>
</style>